<template>
  <div v-if="tencentMapSrc" style="width: 600px; height: 580px">
    <iframe id="mapPage" width="100%" height="100%" frameborder="0" :src="tencentMapSrc" />
  </div>
</template>

<script>
// import {mapGetters} from "vuex";
export default {
  props: {
    tencentMapSrc: {
      require: false,
      default:
          'http://apis.map.qq.com/tools/locpicker?coord=113.258339809,23.149134849&search=1&type=1&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&referer=myapp&zoom=18'
    }
  },
  data() {
    return {}
  },
  computed: {
    // ...mapGetters(["userInfo"])
  },
  watch: {
    // userInfo(newValue, oldValue) {
    // }
  },
  created() {},
  mounted() {
    const that = this
    window.addEventListener(
      'message',
      function(event) {
        // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
        var loc = event.data
        if (loc && loc.module == 'locationPicker') {
          // 防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
          that.$emit('getPackingLocation', loc)
        }
      },
      false
    )
  },
  destroyed() {},
  methods: {
    /* 数据请求*/
    /* 按钮点击*/
    /* other*/
  }
}
</script>

<style scoped lang="scss">
  .TencentMap {
    padding: 20px;
  }
</style>
<!--
 {
    path: '/15:20',
    component: Layout,
    redirect: '/15:20/TencentMap',
    name: '15:20',
    meta: {title: 'jzfai管理', icon: 'example'},
    children: [
      {
        path: 'TencentMap',
        name: 'TencentMap',
        component: () => import('@/views/15:20/TencentMap'),
        meta: {title: 'jzfai列表', icon: 'form'},
        hidden: false
      },

    ]
  },
-->
